<link rel="stylesheet" href="/site_media/css/popup.css" type="text/css" media="screen" />
<link type="text/css" href="/site_media/js/jquery/ui/themes/base/ui.all.css" rel="stylesheet" />
<style>
#popupAddCard {
    display:none;
    position:fixed;
    _position:absolute; /* hack for internet explorer 6*/
    height:330px;
    width:408px;
    background:#FFFFFF;
    border:2px solid #cecece;
    z-index:2;
    padding:12px;
    font-size:13px;
}

#popupAddCard h1{
    text-align:left;
    color:#6FA5FD;
    font-size:15px;
    font-weight:700;
    border-bottom:1px dotted #D3D3D3;
    padding-bottom:2px;
    margin-bottom:20px;
}
</style>

<script type="text/javascript" src="/site_media/js/jquery/ui/ui/ui.core.js"></script>
<script type="text/javascript" src="/site_media/js/jquery/ui/ui/ui.datepicker.js"></script>

<script type="text/javascript">
  $(function() {
    $("#startdate").datepicker();
  });
  $(function() {
    $("#enddate").datepicker();
  });

</script>

<div id="popupAddCard">
  <a id="popupClose" class="popupclose">x</a>
  <form method="POST" action="/cardwall/add_card">
    <input type="hidden" name="wall_id" value="{{wall_id}}">
    <h1>Add Card</h1>  
    <div class="lightbox_content">
      <div>
	<p>
	  <label for="card_title" class="ligtbox">Title:</label> 
	  <input type="text" id="card_title" name="card_title" class="lightbox_text" />
	</p>
	<p>
	  <label for="startdate" class="ligtbox">Start:</label> 
	  <input type="text" id="startdate" name="startdate" class="lightbox_date_text" />

	  <label for="enddate" class="ligtbox_small">End:</label> 
	  <input type="text" id="enddate" name="enddate" class="lightbox_date_text" />
	</p>
	<p>
	  <label for="card_devs" class="ligtbox">Developers:</label> 
	  <input type="text" id="card_devs" name="card_devs" class="lightbox_text" />
	</p>
	<p>
	  <label for="card_points" class="ligtbox">Points:</label> 
	  <input type="text" id="card_points" name="card_points" class="lightbox_small_text" />
	  <label for="card_color" class="ligtbox_small">Color:</label> 
	  <input type="text" id="card_color" name="card_color" class="lightbox_small_text" disabled="true" />
	</p>
	<p>
	  <label for="card_desc" class="ligtbox">Descrption:</label> 
	  <textarea id="card_desc" name="card_desc" class="ligtbox_desc"></textarea>
	</p>
      </div>
      <div class="buttonbox">
	<input type="submit" class="submitbutton" value=" Save " />
	<input id="cancelPopup" type="button" class="cancelbutton" value="Cancel"/>
      </div>
    </div>
  </form>
</div>
